<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
  </head>
  <body>
    <div class="test">test</div>
  </body>
  <script>
    // 事件对象实例化
    var event1 = new Event("watch", {
      bubbles: true,
      cancelable: false,
    });
    // 事件监听
    document.querySelector(".test").addEventListener("watch",fn)
    function fn(){
        console.log("这是自定义事件的触发");
    }
    //触发事件
    document.querySelector(".test").dispatchEvent(event1)
  </script>
</html>
